<template>
<div class="aaaa">
  <check-bar :checkboxStatus.sync="chooseStatus" :isShow="isShow" :pageNumber.sync="pageNumber" :refreshFunction="getPictures" :data.sync="pictures"></check-bar>

  <!--  -->
  <mu-row gutter class="picture-list-box">
    <mu-col desktop="100">
      <grid-list :list.sync="pictures" :chooseStatus="chooseStatus"></grid-list>
    </mu-col>
  </mu-row>
  <!--  -->

  <check-bar :checkboxStatus.sync="chooseStatus" :isShow="isShow" :pageNumber.sync="pageNumber" :refreshFunction="getPictures":data.sync="pictures"></check-bar>
  
</div>
</template>
<script>
  import gridList from '../components/grid-list.vue'
  import checkBar from '../components/check-bar.vue'
  import http from "../http/http.js" 
  export default {
    data () {
      return {
        chooseStatus:false,//是否选中所有违背屏蔽的图片
        pageNumber:10,//每页显示多少个
        isShow:false, //控制check-bar上的刷新状态图标是否显示

        getPicturesUrl: this.config.getPicturesUrl,
        pictures:[],
      }
    },
    components : {
      gridList,
      checkBar
    },
    methods: {
      changePageNumber:function(){
        console.log(this.pictures)
      },
      //是否屏蔽所有图片
      chooseAll: function(){
        console.log(!this.chooseStatus);
      },
      // 获取用户图片
      getPictures:function(){
        var that = this
        that.isShow = true
        that.chooseStatus = false//是否选中所有违背屏蔽的图片

        http.get(that.getPicturesUrl,{
          params:{
            where:[
              {key:'picture_check',where:'=',value:0}
            ],
            page:1,
            pageNumber:that.pageNumber
          }
        }
        )
        .then(function(response){
          that.pictures = response.data.data;
          that.isShow = false
        })
        .catch(function(err){console.log(err)});
      }

    },
    mounted() {
      // 获取用户图片
      this.getPictures()
    },
    watch:{
      // chooseStatus(val,oldVal){

      // },
      // pageNumber(val,oldVal){
      //   this.pageNumber = val
      //   console.log(val)
      //   console.log(oldVal)
      // },
    },
  }
</script>

<style lang="css">

</style>